.Weather {
  @apply flex-1 h-full;
  color: #000;

  @media screen and (max-width: 700px) {
    font-size: 10px !important;
  }
}

.Content {
  @apply grid grid-rows-3 h-full select-none gap-4;
  flex: 1;
  overflow: hidden;

}

.WeatherDayBg {
  background-color: #0095c7de;
  background: linear-gradient(225deg, #ffedd0c4, #dff3ffbe 48%, #bde1ffb2);
}

.WeatherNightBg {
  // background-color: #023d8abb;
  // background-image: linear-gradient(40deg, #0058ccab 30%, #00367cbb, #003780bb);
  background-color: #0095c7de;
  background: linear-gradient(225deg, #ffedd0c4, #dff3ffbe 48%, #bde1ffb2);
}

.Conm11 {
  @apply flex-1 h-full flex flex-col justify-center gap-1 items-center;
}

.Conm12 {
  @apply flex-1 h-full flex justify-between px-5 items-center;
}

.Conm21 {
  @apply flex-1 h-full flex flex-col justify-between py-5 items-center;
}

.Conm22 {
  @apply flex-1 h-full grid;
  grid-template-rows: 2fr 1fr;
}

.Conm24 {
  @apply flex-1 h-full grid;
  grid-template-rows: 1fr 1fr;
}